<template>
  <div class="mt10">
    <div class="clearfix">
      <span class="mr10">访客定向</span>
      <span class="s_fc_9 mr10" style="max-width: 76%;" title="近期访问过某些店铺的人群">近期访问过某些店铺的人群</span>
      <el-button @click="visitorShowModal" type="text">设置定向</el-button>
      <div class="popup">
        <el-dialog
          title="访客定向"
          :visible.sync="visitorDialog"
          :close-on-click-modal="false"
          width="600px">
          <div style="height:auto;" class="slotContent">
            <textarea name="" id="" cols="30" rows="10" class="text" placeholder="以换行区分不同的店铺，请输入自主店铺……" v-model="visitorText"></textarea>
          </div>
          <span slot="footer" class="dialog-footer slotFooter">
            <a href="javascript:;" class="warning" v-show="warning7">
              <i class="el-icon-warning"></i>
              请输入自主店铺。
            </a>
            <el-button @click="visitorDialog=false" size="small">取 消</el-button>
            <el-button type="primary" @click="visitorConfirm"  size="small">确 定</el-button>
          </span>
        </el-dialog>
      </div>
    </div>
  </div>
</template>
<style src="./style.styl" scoped lang="stylus"></style>
<style>
  .text{
    width: 100%;
    height: 378px;
    border: 1px solid #e6e6e6;
    border-radius: 4px;
    margin-top:20px;
    padding: 10px;
    box-sizing: border-box;
  }
</style>
<script>
  export default {
    props:{
      visitorMsg:Array
    },
    data() {
      return {
        visitorDialog: false,
        visitorText:'',
        warning7: false,
        visitorList: [],
      }
    },
    methods: {
      visitorShowModal() {//设置访客定向
        this.visitorDialog = true;
        this.warning7 = false;
        if(this.visitorMsg.length){
          let arr = [];
          this.visitorMsg.forEach((item,index)=>{
            arr.push(item.name);
          })
          this.visitorText = arr.join('\n');
        }
      },
      visitorConfirm() {//访客定向的确认
        this.visitorList = [];
        if(!this.visitorText){
          this.warning7 = true;
        }else{
          this.warning7 = false;
          let arr = this.visitorText.split('\n');
          arr = arr.filter(item=>item);//es6去掉空值
//          visitorList
          arr.forEach((item,index)=>{
            this.visitorList.push({
              id:index,
              name: item,
              matrix_price:{}
            })
          })
          this.$emit("visitorData",this.visitorList);//传给父组件
          this.visitorDialog = false;
        }



      }
    }
  }
</script>

